<template>
	<view class="u-modal">
		<view class="commentChildren-top" v-for="(item,index) in commentsList " :key="index">
			<view class="name">{{item.name}}</view>
			<view class="content">{{item.content}}</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted,
		computed,
		defineProps,
		watch
	} from "vue";
	import {
		listComment,
		addComment,
		commentChildren
	} from '@/api/comment.js'
	import {
		listPost
	} from '@/api/tiezi/post'
	onMounted(() => {
		//评论子列表
		// commentChildren().then(()=>{
			
		// })
	})
	const Data = ref()
	const props = defineProps({
		data: { // 与父组件传递的属性名匹配，注意这里是小写'data'
			type: Object,
			required: true,
		},

	})
	// console.log(props,'props')
	watch(() => props.data, async (newQuestion, oldQuestion) => {
		console.log(props.data, 'props')
		Data.value = props.data
		// console.log(Data.value,'Data')
	})
	const commentsList = ref([{
			name: '微信用户1',
			img: '../../../../static/images/banner/touXiang01.png',
			content: '很好，特别好',
			time: '2024-03-25 21:15:39',
		},
		{
			name: '微信用户2',
			img: '../../../../static/images/banner/touXiang01.png',
			content: '很好，特别好',
			time: '2024-03-25 21:15:39',
		},
		{
			name: '微信用户3',
			img: '../../../../static/images/banner/touXiang01.png',
			content: '很好，特别好',
			time: '2024-03-25 21:15:39',
		},
		{
			name: '微信用户3',
			img: '../../../../static/images/banner/touXiang01.png',
			content: '很好，特别好',
			time: '2024-03-25 21:15:39',
		},
		{
			name: '微信用户4',
			img: '../../../../static/images/banner/touXiang01.png',
			content: '很好，特别好',
			time: '2024-03-25 21:15:39',
		},
		{
			name: '微信用户5',
			img: '../../../../static/images/banner/touXiang01.png',
			content: '很好，特别好',
			time: '2024-03-25 21:15:39',
		}
	])
</script>

<style lang="scss" scoped>
	.u-modal {
		background-color: #f2f2f2;
		border-radius: 15rpx;
		padding: 15rpx;

		.commentChildren-top {
			border-bottom: 2rpx solid #ccc;

			view {
				margin: 15rpx;
				padding: 15rpx auto;
			}

			.name {
				color: #c3c3c3;
			}

			.content {
				color: #aaaaaa;

			}
		}
	}
</style>